<template>
  <view>
    <view class="query-flex">
      <view class="padd-left-right">
        <view class="spacing">
          <view class="con-display border-bottom">
            <view class="flex-left">调入管理员</view>
            <view class="flex-right">刘丽</view>
          </view>
          <view class="con-display border-bottom">
            <view class="flex-left">业务日期</view>
            <view class="flex-right">2021-10-25</view>
          </view>
          <view class="con-display border-bottom">
            <view class="flex-left">选择区域</view>
            <view class="flex-right">长沙</view>
          </view>
          <view class="con-display border-bottom">
            <view class="flex-left">处理人</view>
            <view class="flex-right">张瑶</view>
          </view>
          <view class="con-display border-bottom">
            <view class="flex-left">备注</view>
            <view class="flex-right"></view>
          </view>
        </view>
      </view>
      <!-- 间隔槽 -->
      <u-gap height="20" bg-color="#edeaea"></u-gap>

      <view class="dis-flex">
        <view class="dis-left-flex">
          <u-image
            width="100rpx"
            height="100rpx"
            src="https://cdn.uviewui.com/uview/example/fade.jpg"
          ></u-image>
        </view>
        <view class="dis-center-flex line-break-exceeded">
          <view>资产名称：酒精123</view>
          <view>资产编码：ASC123412542651</view>
        </view>
        <view class="dis-right-flex color-blue">调拨中</view>
      </view>
    </view>

    <!-- 按钮 -->
    <view class="flexinven-button">
      <u-row gutter="16" class="flexinven-con">
        <u-col span="6">
          <u-button type="primary" @click="fold">调入</u-button>
        </u-col>
        <u-col span="6">
          <u-button type="warning" @click="cancel">取消</u-button>
        </u-col>
      </u-row>
    </view>
  </view>
</template>

<script>
export default {
  data() {
    return {
      inputForm: {
        name: "",
        time: "",
        spend: "",
        content: "",
        remarks: "",
      }
    }
  },
  methods: {
    // 调入
    fold() {
      uni.navigateTo({
        url: "/pages/eam/Assets/AssetsList/assetallocation/AssetTransferDocConfirmation",
      })
    },
    // 取消
    cancel() {
      uni.navigateTo({
        url: "/pages/eam/Assets/AssetsList/assetallocation/AssetAllocationList",
      })
    }
  }
}
</script>

<style lang="scss" scoped>
.dis-flex {
  padding: 20rpx;
  border-bottom: 1px solid #ccc;
  display: flex;
  .dis-left-flex {
    flex: 20%;
  }
  .dis-center-flex {
    flex: 40%;
    padding: 0 10rpx;
  }
  .dis-right-flex {
    flex: 40%;
    padding: 0 10rpx;
    text-align: right;
  }
}

.con-display {
  display: flex;
  padding: 20rpx;

  .flex-left {
    flex: 1;
  }

  .flex-right {
    flex: 1;
    text-align: right;
  }

  .flex-left-custom {
    flex: 40%;
  }

  .flex-right-custom {
    flex: 60%;
  }
}

.color-blue {
  color: #007aff;
}
</style>
